<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>조립PC의 대명사- PC Master~!~!</title>

<script>   

////////////////// -- 메인페이지 배너 아이콘에 마우스 오버 시 이미지  변환 -- /////////////////
function bannerChange(n) { 
   var banner_img, banner_btn;
   for (var i=1; i<=3; i++) { //이미지 수가 3개
      banner_img = document.getElementById("banner_img"+i); 
      banner_btn = document.getElementById("banner_btn"+i); 

      if (i==n) { 
         banner_img.style.display = ""; 
         banner_btn.src = banner_btn.src.replace("_off.gif", "_on.gif"); 
         } else { 
         banner_img.style.display = "none"; 
         banner_btn.src = banner_btn.src.replace("_on.gif", "_off.gif"); 
      } 
   } 
} 
</script> 

</head>
<body>

<!-- 이벤트 후기 이미지 및 로고 이미지 -->
<div style="position:absolute; left:50%; top:30px; width:1200px; height:80px; margin-left:-600px;">
<table width="1200px" border="0" cellspacing="0" cellpadding="0"><tr>
	<td align="left" width="100px">
		<img src="/web/resources/images/main/Nega_banner_1.jpg" style="cursor:pointer "onclick="location.href='/web/board/list'"/>
	</td>
	<td align="left" width="1100px" height="40px" align="center" style="padding-left:340px ">
		<input type="image" src="/web/resources/images/main/logo.jpg" width="200px" height="80px" onclick="location.href='/web/'"/>
	</td>
</tr>
</table>
</div>

<!-- 좌측 상단 카테고리 리스트  -->
<div style="position:absolute; left:50%; top:120px; width:1200px; height:80px; margin-left:-600px; ">
<table width="1200px" border="0" cellspacing="0" cellpadding="0">
<tr>

		<td align="center" width="110px" height="40px" bgcolor="#242424">
			<a href="/web/" >
				<strong style="color: #FFFFFF;">&nbsp;홈으로&nbsp;&nbsp;&nbsp;|</strong>
			</a>
		</td>
		<td align="center" width="110px" height="40px" bgcolor="#242424">
			<a href="/web/goods/list" >
				<strong style="color: #FFFFFF;">&nbsp;가격대별&nbsp;&nbsp;&nbsp;&nbsp;|</strong>
			</a>
		</td>
		<td align="center" width="110px" height="40px" bgcolor="#242424">
			<a href="#" >
				<strong style="color: #FFFFFF;">&nbsp;제품별&nbsp;&nbsp;&nbsp;&nbsp;|</strong>
			</a>
		</td>
		<td align="center" width="110px" height="40px" bgcolor="#242424">
			<a href="#" >
				<strong style="color: #FFFFFF;">베스트상품&nbsp;&nbsp;</strong>
			</a>
		</td>				
<!-- 중앙 상단 검색버튼 이미지  -->		
		<td align="right" valign="bottom" width="97px" height="40px" bgcolor="#FFFFFF">
			<img src="/web/resources/images/main/search_01n.jpg" />
		</td>
		<td width="140px"></td>
		<td align="center" valign="bottom" width="80px" height="40px" bgcolor="#FFFFFF">	
			<input type="image" src="/web/resources/images/main/search_02n.jpg"/>		
		</td>

<!-- 우측 상단 카테고리 리스트  -->		
		<td align="center" width="125px" height="40px" bgcolor="#242424">
			<a href="#" >
				<strong style="color: #FFFFFF;">&nbsp;&nbsp;묻고답하기&nbsp;&nbsp;&nbsp;|</strong>
			</a>
		</td>
		<td align="center" width="125px" height="40px" bgcolor="#242424">
			<a href="/web/board/list" >
				<strong style="color: #FFFFFF;">&nbsp;후기게시판&nbsp;&nbsp;&nbsp;|</strong>
			</a>
		</td>
		<td align="center" width="90px" height="40px" bgcolor="#242424">
			<a href="#" >
				<strong style="color: #FFFFFF;">&nbsp;이벤트&nbsp;&nbsp;&nbsp;|</strong>
			</a>
		</td>
		<td align="center" width="100px" height="40px" bgcolor="#242424">
			<a href="#" >
				<strong style="color: #FFFFFF;">공지사항&nbsp;</strong>
			</a>
		</td>						
</tr>
</table>
</div>

<!-- 중앙 상단 검색버튼 텍스트  -->	
<div style="position:absolute; left:50%; top:126px; width:1200px; height:80px; margin-left:-65px; ">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
	<td align="center" valign="bottom" width="120px" height="34px" align="center" bgcolor="#FFFFFF">
		<input type="text" style="width:155px; height:25px; border-top-style:solid; border-top-width:3px; 
			border-top-color:black; border-bottom-style:solid; border-bottom-width:3px; 
			border-bottom-color:black; border-left-style:none; font-size: 13pt"/>
	</td>
</tr>
</table>
</div>

<!-- 전체 카테고리(데스트탑) 이미지 -->
<div style="position:absolute; left:50%; top:161px;width:1200px; height:80px; margin-left:-600px;">
	<img src="/web/resources/images/main/all-category.jpg" border="0" style="width:200px; height:19px; "/>
<table width="250px" border="0" cellspacing="0" cellpadding="0">
<tr height="20px">
	<td width="65px" >
		<img src="/web/resources/images/menu/cate-title1.jpg" border="0"/>
	</td>
</tr>
<!-- 좌측 하단 카테고리 리스트  -->

	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-01-01-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-01-01-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-01-01-off.jpg'" />
			</a>
		</td>
	</tr>
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-01-02-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-01-02-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-01-02-off.jpg'" />
			</a>
		</td>
	</tr>
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-01-03-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-01-03-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-01-03-off.jpg'" />
			</a>
		</td>
	</tr>
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-01-04-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-01-04-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-01-04-off.jpg'" />
			</a>
		</td>
	</tr>
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-01-05-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-01-05-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-01-05-off.jpg'" />
			</a>
		</td>
	</tr>
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-01-06-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-01-06-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-01-06-off.jpg'" />
			</a>
		</td>
	</tr>					

</table>
</div>

<!-- 전체 카테고리 (주변기기) 카테고리 -->
<div style="position:absolute; left:50%; top:360px; width:1200px; height:80px; margin-left:-600px;">
<table width="250px" border="0" cellspacing="0" cellpadding="0">
<tr height="20px">
	<td width="65px">
		<img src="/web/resources/images/menu/cate-title2.jpg" border="0"/>
	</td>
</tr>

	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-02-01-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-02-01-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-02-01-off.jpg'" />
			</a>
		</td>
	</tr>
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-02-02-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-02-02-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-02-02-off.jpg'" />
			</a>
		</td>
	</tr>
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-02-03-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-02-03-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-02-03-off.jpg'" />
			</a>
		</td>
	</tr>			
	<tr height="22px">
		<td colspan="2">
			<a href="#" >
				<img src="/web/resources/images/menu/menu-02-04-off.jpg" border="0"
					onMouseOver="this.src='/web/resources/images/menu/menu-02-04-on.jpg'" 
					onMouseOut="this.src='/web/resources/images/menu/menu-02-04-off.jpg'" />
			</a>
		</td>
	</tr>
</table>
</div> 

<!--  좌측 ssd 관련 이미지 -->
<div style="position:absolute; left:50%; top:510px; width:1200px; height:80px; margin-left:-600px;">
<table width="200px" border="0" cellspacing="0" cellpadding="0">
<tr>
	<td>
		<img src="/web/resources/images/main/main-btn01-on.jpg" style="width:200px; height:155px; cursor:pointer " onclick="location.href='/web/ssd'"/>
	</td>
</tr>
</table>
</div>

</body>
</html>